<template>
  <div class="main-bg">
    <div class="first">
      <el-row >
        <el-button class="el-icon-delete" type="primary" @click="delClick()" size="mini">
          清理日志文件
        </el-button>
      </el-row>
      <div style="height:5px;">&nbsp;</div>
    </div>
      <el-input style="margin-bottom:12px;width:50%"
                placeholder="输入关键字进行过滤"
                v-model="filterText" clearable>
      </el-input>
      <div :id="target">
        <el-tree
          :filter-node-method="filterNode"
          :data="URI"
          node-key="path"
          :props="props"
          ref="tree"
          show-checkbox
          default-expand-all
          :expand-on-click-node="false"
          :style="{'max-height':slide_h+'px'}"
          style="overflow-y: auto;"
        >
          <div class="custom-tree-node" slot-scope="{ node, data }">
            <span><i :class="data.isDirectory?'el-icon-menu':'el-icon-document'"/>{{ data.name + "【"+ data.size+"】"}} </span>
          </div>
        </el-tree>
      </div>
    </div>
</template>
<script>
  export default {
    inject:["reload"],
    watch: {
      filterText(val) {
        this.$refs.tree.filter(val);
      }
    },
    data() {
      return {
        target:"sysFileLog",
        filterText: '',
        URI:[],
        isajax: false,
        closeonclickmodal: true,
        slide_h:document.body.offsetHeight - (224),
        props: {
          label: 'name',
          children: 'subTree'
        }
      }
    },
    methods: {
      init() {
        this.$store.commit("saveLoadingMap",{"target":this.proAPI.URLS.getAllSysLogFile,"id":this.target});
        this.proAPI.getJson(this.proAPI.URLS.getAllSysLogFile).then((res) => {
          this.URI = res.data;
        })
      },
      getCheckedKeys() {
        return this.$refs.tree.getCheckedKeys();
      },
      setCheckedKeys(arr) {
        this.$refs.tree.setCheckedKeys(arr);
      },
      resetChecked() {
        this.$refs.tree.setCheckedKeys([]);
      },
      filterNode(value, data) {
        if (!value) return true;
        return data.name.indexOf(value) !== -1;
      },
      delClick(){
        console.log(this.getCheckedKeys());
        this.$confirm('你确定删除所选的日志文件吗?', '温馨提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          callback: action => {
            if(action=="confirm"){
              this.$store.commit("saveLoadingMap",{"target":this.proAPI.URLS.delAllSysLogFile,lock:1,text:this.loadingTxt});
              this.proAPI.postJson(this.proAPI.URLS.delAllSysLogFile,{paths:this.getCheckedKeys()}).then((res)=>{
                this.$message.success({
                  "message":res.message
                })
                this.reload();
              }).catch(()=>{
                this.$store.commit("clearLoadingMap");
              })
            }
          }
        });
      }
    },
    mounted() {
      this.init();
    },
    updated() {
      // console.log(333);
    },
    afterCreated() {

    }
  }
</script>
<style scoped>
  .col_block{
    border: 1px solid #ebebeb;
    border-radius: 3px;
    transition: .2s;
  }
  .custom-tree-node {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    padding-right: 8px;
  }
</style>
